<!-- 个人中心 -->
<template>
	<view class="container">
		<view class="top" v-for="item in list">
			<view class="top1">
					<view class="title">{{item.title}}</view>
					<view class="time">{{item.createtime | dateFormat}}</view>

			</view>
			<view class="content">
				{{item.content}}
			</view>
			<view class="xq" @click="goPage('pages/personalCenter/msgDetail?data='+JSON.stringify(item),true)">查看详情</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list:[]
			}

		},
		filters:{
			dateFormat(time) {
							let date = new Date(time*1000);
							let year = date.getFullYear();
							// 在日期格式中，月份是从0开始的，因此要加0，使用三元表达式在小于10的前面加0，以达到格式统一  如 09:11:05
							let month = date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1;
							let day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
							let hours = date.getHours() < 10 ? "0" + date.getHours() : date.getHours();
							let minutes = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
							let seconds = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
							// 拼接
							return year + "-" + month + "-" + day + " " + hours + ":" + minutes + ":" + seconds;
							// return year + "年" + month + "月" + day+"日";
			},
		},
		onLoad() {
			
		},
		onShow() {
			this.usermail();
		},
		computed: {

		},
		methods: {
			usermail(){
			this.$api.usermail().then(res => {
				console.log(res)
				if (res.code == 1) {
					this.list=res.data
				}
			});	
			}
		}
	}
</script>
<style>
	page{
		background-color: #F5F5F5;
	}
</style>
<style lang="scss" scoped>
	* {
		box-sizing: border-box;
		margin: 0;
		padding: 0;
	}

	.container {
		padding: 0px 30rpx 0rpx 30rpx;
	}

	.top1 {
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	
	.top {
		padding: 20rpx;
		height: 330rpx;
		background: #ffffff;
		border-radius: 10rpx 10rpx 10rpx 10rpx;
		margin-top: 30rpx;
		border-bottom: 1px solid #EEEEEE;
	}

	.title {
		font-size: 30rpx;
		font-family: Source Han Sans CN-Regular, Source Han Sans CN;
		font-weight: 400;
		color: #333333;
		overflow: hidden;
		width: 400rpx;
	}

	.you {
		margin-left: 20rpx;
	}

	.img {
		margin-left: 8rpx;
	}

	.content {
		height: 122rpx;
		background: #dedcdc;
		border-radius: 10rpx 10rpx 10rpx 10rpx;
		opacity: 1;
		margin-top: 10rpx;
		font-size: 28rpx;
		font-family: Source Han Sans CN-Regular, Source Han Sans CN;
		font-weight: 400;
		color: #666666;
		padding: 20rpx;
		overflow: hidden; //超出的文本隐藏
		
		text-overflow: ellipsis; //溢出用省略号显示
		
		display: -webkit-box;
		white-space: nowrap; // 默认不换行；
		
		-webkit-line-clamp: 2; // 超出多少行
		
		-webkit-box-orient: vertical;
	}

	.time {
		font-size: 26rpx;
		font-family: Source Han Sans CN-Regular, Source Han Sans CN;
		font-weight: 400;
		color: #CCCCCC;
		margin-top: 25rpx;
		margin-bottom: 30rpx;
	}
	.xq{
		font-size: 30rpx;
		color: red;
text-align: right;
		margin-top: 20rpx;
	}
</style>
